<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title></title>
	<style type="text/css">
         /*	后代选择器： 选中father里的所有p标签 不区分儿子还是孙子	*/
         .father p{
         	   background: green;
         }
        .father .son ul .item{
        	font-size: 30px;
        }

          /* 子代选择器：        
                只选儿子 不选后代

          */
        .son>p{
        	text-decoration: underline;
        }
	</style>
</head>
<body>
	<p class="item">保皇</p>
	<div class="father">
		<div class="son">
			<p>元神</p>
			<span>奇迹暖暖</span>
			<ul>
				<li class="item">lol</li>
				<li class="item">王者荣耀</li>
				<li class="item">第五人格</li>
				<li>火影忍者</li>
				<li>和平精英</li>
				<li>
					<ul>
						<li>抽王八</li>
						<li>
							<p>够级</p>
						</li>
					</ul>
				</li>
			</ul>
		</div>
	</div>

</body>
</html>